<template>
  <div class="role-manage">
    <search-table :url="url" ref="searchtable" :columns="columns" :form="form">
      <template slot="searchForm">
        <a-form layout="inline" :form="form">
          <a-form-item label="字典名称">
            <a-input
              v-decorator="[
                'name',
              ]"
              placeholder="请输入字典名称"
            >
            </a-input>
          </a-form-item>
          <a-form-item label="字典值">
            <a-input
              v-decorator="[
                'dictValue',
              ]"
              placeholder="请输入字典值"
            >
            </a-input>
          </a-form-item>
          <a-form-item label="字典类型">
            <a-select
              showSearch
              allowClear
              style="width: 150px"
              :options="typeOptions"
              v-decorator="[
                'type',
              ]"
              placeholder="请选择字典类型"
            >
            </a-select>
          </a-form-item>
        </a-form>
      </template>
      <template slot="oprationRow">
        <permission authority="roles:add">
          <a-button type="primary" icon="plus" @click="openInfo()">添加</a-button>
        </permission>
        <permission authority="roles:delete">
          <a-button @click="deleteRows(selectedRowKeys)" type="primary" icon="delete">删除</a-button>
        </permission>
        </template>
      <template slot="tableOperation" slot-scope="{record}">
        <permission authority="permissions:delete">
          <span class="text-primary pointer" @click="openInfo(record)">修改</span>
        </permission>
        <a-divider type="vertical" />
        <permission authority="permissions:delete">
          <span class="text-danger pointer" @click="deleteRows([record.id])">删除</span>
        </permission>
      </template>
    </search-table>
    <dict-info :record="currentRecord" @cancel="closeInfoModal" :visible="infoVisible" />
  </div>
</template>
<script>
import DictInfo from './components/DictInfo'
import { findDictNameByValue, createOptionsByDict } from '@/utils/dict'
export default {
  name: 'Role',
  data () {
    return {
      url: '/sys/dict',
      infoVisible: false,
      typeOptions: createOptionsByDict(1),
      currentRecord: {},
      form: this.$form.createForm(this, { name: 'table_search' }),

      columns: [
        {
          title: '字典名称',
          dataIndex: 'name',
          key: 'name'
        },
        {
          title: '字典值',
          dataIndex: 'dictValue',
          key: 'dictValue'
        },
        {
          title: '字典类型名称',
          dataIndex: 'typeNumber',
          key: 'typeNumber',
          customRender: (text, record) => findDictNameByValue('1', record.type)
        },
        {
          title: '字典类型值',
          dataIndex: 'type',
          key: 'type'
        },
        {
          title: '描述',
          dataIndex: 'remark',
          key: 'remark'
        },
        {
          title: '排序',
          dataIndex: 'sort',
          key: 'sort'
        },
        {
          title: '操作',
          dataIndex: 'operation',
          scopedSlots: { customRender: 'operation' }
        }]
    }
  },
  components: {
    DictInfo
  },
  methods: {
    closeInfoModal (freshTable) {
      this.infoVisible = false
      if (freshTable) {
        this.$refs.searchtable.refreshTable()
      }
    },
    openInfo (record) {
      this.currentRecord = record
      this.infoVisible = true
    },
    deleteRows (ids) {
      if (!ids || ids.length === 0) return this.$message.warn('请先选择一项后再进行操作')
      this.$confirm({
        title: '删除提示',
        content: '删除操作不可恢复，请确认是否删除？',
        okText: '确认删除',
        cancelText: '取消',
        onOk: () => {
          this.$post('/sys/dict/delete', ids).then(res => {
            if (res && res.returnCode == 1000) {
              this.$message.success('删除成功')
              this.$refs.searchtable.refreshTable()
            }
          })
        }
      })
    }
  }
}
</script>
<style lang="less" scoped>

</style>
